<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        var name = '南玖'
        function Person(name) {
            this.name = name
            this.foo1 = function () {
                console.log(this.name)
            },
                this.foo2 = () => {
                    console.log('this', this);
                    console.log(this.name)
                },
                this.foo3 = function () {
                    console.log('foo3 this out', this);
                    console.log(this.name);

                    return function () {
                        console.log(' foo3 this inside', this);
                        console.log(this.name)
                    }
                },
                this.foo4 = function () {
                    console.log('foo4 this out', this);
                    console.log(this.name);
                    return () => {
                        console.log('foo4 this inside', this);
                        console.log(this.name)
                    }
                }
        }
        var person1 = new Person('nan')
        var person2 = new Person('jiu')

        // person1.foo1() // 'nan'
        // person1.foo1.call(person2) // 'jiu'

        // person1.foo2() // 'nan'
        // person1.foo2.call(person2) // 'nan'

        // person1.foo3()() // '南玖'
        // person1.foo3.call(person2)() // '南玖'
        // person1.foo3().call(person2) // 'jiu'

        // person1.foo4()() // 'nan'
        // person1.foo4.call(person2)() // 'jiu'
        // person1.foo4().call(person2) // 'nan'

    </script>
</body>

</html>